<template>
	<div class="spread con sale_index">
		<el-breadcrumb separator-class="el-icon-arrow-right">
			<el-breadcrumb-item :to="{ path: '/purchase' }">Homepage</el-breadcrumb-item>
			<el-breadcrumb-item>Active RFQ List</el-breadcrumb-item>
		</el-breadcrumb>
		<div style="margin-left: 10px;margin-bottom:10px;">
			<span>PartNo:</span>
			<el-input v-model="PurchOrderNo" placeholder="Search PartNo" style="width:10%"  filterable clearable></el-input>
			<span>Date:</span>
			<el-date-picker
				v-model="rantime"
				value-format="yyyy-MM-dd"
				type="daterange"
				start-placeholder="Start Date"
				end-placeholder="End Date"
				:default-time="['00:00:00', '23:59:59']"
			></el-date-picker>
			
			<span>Sales:</span>
				<el-select  v-model="salesId" filterable placeholder="Please choose"  filterable clearable>
				    <el-option
				            v-for="item in SalesList"
				            :key="item.employeeID"
				            :label="item.employeeName"
				            :value="item.employeeID">
				    </el-option>
				</el-select>	
			
				<span>Buyer:</span>
				<el-select v-model="buyerId" filterable placeholder="Please choose"  filterable clearable>
				    <el-option
				            v-for="item in BuyerList"
				            :key="item.employeeID"
				            :label="item.employeeName"
				            :value="item.employeeID">
				    </el-option>
				</el-select>
				
				<span style="margin-left: 10px;"></span>
			<el-checkbox v-model="Bom" style="margin-left:-10px;" >Bom</el-checkbox>
			<el-checkbox v-model="Hot" style="margin-left: -20px;" >Hot</el-checkbox>
			<el-checkbox v-model="Active" style="margin-left: -20px;">Active</el-checkbox>
			<!--<el-checkbox v-model="Brief" >Brief</el-checkbox> -->
			
			<el-button type="info" icon="el-icon-search" @click="handerSearch"></el-button>
		</div>	
		<div style="margin-left: 10px;margin-bottom:10px;">
			
		</div>
		<div style="margin-top:0px;margin-left: 10px;margin-bottom:0px;">
			<el-button type="danger" icon="el-icon-tickets" @click="AddRFQ()">Add RFQ</el-button>
			<el-button type="danger" icon="el-icon-tickets" @click="EditRFQ()">Edit RFQ</el-button>
			<el-button type="danger" icon="el-icon-tickets" @click="SetHot()">Set Hot</el-button>
			
			<el-button type="danger" icon="el-icon-tickets" @click="addQuotation()">Add Quotation</el-button>
			
			<el-button type="danger" icon="el-icon-tickets" @click="addSalesQuotation()">Add Sales Quotation</el-button>
			<!-- <el-button type="danger" icon="el-icon-tickets" @click="ExportRFQ()">ExportRFQ</el-button>  -->
			<el-button type="danger" icon="el-icon-tickets" @click="AddCall()">AddCall</el-button>
			<!-- <el-button type="danger" icon="el-icon-tickets" @click="MultiAddCall()">MultiAddCall</el-button> -->
		</div>
		
		<!--<div style="float:right ">
			<span class="el-pagination__total" style="margin-left: 20px;"> {{page.total}} data in total</span> 
		</div> -->
		<div style="float:right; ">
				<el-pagination
					background
					layout="prev, pager, next"
					:total="page.per_page"
					:page-size="page.size"
					@current-change="handleCurrentChange"
					:current-page.sync="page.currentPage"
				></el-pagination>
			</div>
		<el-table
			v-loading="loading"
			element-loading-text="Loading"
			:data="tableData"
			style="width: 100%"
			:height="tableHeight"
			border
			fit
			highlight-current-row
			@row-click="rowClick"
			@current-change="shandleCurrentChange">
			
			<el-table-column label="VIP" width="50">
				<template slot-scope="scope">
					<span v-if="scope.row.VIP==0"></span>
					<span v-else ><img width="30" height="30" src="/uploads/icon/VIP.png"></span>
				</template>
			</el-table-column>
			<el-table-column label="Hot" width="50">
				<template slot-scope="scope">
					<span v-if="scope.row.Hot==0"></span>
					<span v-else ><img width="30" height="30" src="/uploads/icon/Hot.png"></span>
				</template>
			</el-table-column>
			<el-table-column label="QN" width="60" >
				<template slot-scope="scope">
					<span>{{ scope.row.QuoteNum }}</span>
				</template>
			</el-table-column>
			
			<el-table-column label="Status" width="110">
				<template slot-scope="scope">
					<span>{{ scope.row.RFQStatusName }}</span>
				</template>
			</el-table-column>
			<el-table-column label="Sales" width="120" >
				<template slot-scope="scope">
					<span>{{ scope.row.SalesRepIDName }}</span>
				</template>
			</el-table-column>
			<el-table-column label="Customer" width="150" >
				<template slot-scope="scope">
					<span>{{ scope.row.CompanyName }}</span>
				</template>
			</el-table-column>
			<el-table-column label="Buyer" width="120">
				<template slot-scope="scope">
					<span>{{ scope.row.PurchReps }}</span>
				</template>
			</el-table-column>
			<el-table-column label="Brand" width="130">
				<template slot-scope="scope">
					<span>{{ scope.row.BrandName }}</span>
				</template>
			</el-table-column>
			<el-table-column label="PartNo" width="180">
				<template slot-scope="scope">
					<span>{{ scope.row.PartNo }}</span>
				</template>
			</el-table-column>
			
			<el-table-column label="Qty" width="120">
				<template slot-scope="scope">
					<span>{{ scope.row.Quantity }}</span>
				</template>
			</el-table-column>
			<el-table-column label="Target" width="150">
				<template slot-scope="scope">
					<span>{{ toDecimal(scope.row.TargetPrice) }}</span>
				</template>
			</el-table-column>
			
			<el-table-column label="DateCode" width="150">
				<template slot-scope="scope">
					<span>{{ scope.row.DateCode }}</span>
				</template>
			</el-table-column>
			<el-table-column label="Package" width="150">
				<template slot-scope="scope">
					<span>{{ scope.row.Package }}</span>
				</template>
			</el-table-column>
			<el-table-column label="LeadFree" width="150">
				<template slot-scope="scope">
					<span>{{ scope.row.LeadFreeName }}</span>
				</template>
			</el-table-column>
			<el-table-column label="CustomerPartNo" width="150">
				<template slot-scope="scope">
					<span>{{ scope.row.CustomerPartNo }}</span>
				</template>
			</el-table-column>
			
			<el-table-column label="CreatedDate" width="180">
				<template slot-scope="scope">
					<span>{{ isTimeString(scope.row.CreatedDate) }}</span>
				</template>
			</el-table-column>
			<el-table-column label="UpdatedDate" width="180">
				<template slot-scope="scope">
					<span>{{ isTimeString(scope.row.UpdatedDate) }}</span>
				</template>
			</el-table-column>
			<el-table-column label="Office" width="150">
				<template slot-scope="scope">
					<span>{{ scope.row.Office }}</span>
				</template>
			</el-table-column>
			<el-table-column label="PurchReps" width="150">
				<template slot-scope="scope">
					<span></span>
				</template>
			</el-table-column>
		</el-table>

		<!-- <div class="block el-pagination" style="margin-top: 0px; overflow: hidden;">
 			<el-pagination class="pages" background layout="prev, pager, next" :total="page.total" :page-size="page.size" @current-change="handleCurrentChange" :current-page.sync="page.currentPage">
 			</el-pagination>
		  </div> -->
		  
		<!-- RFQ  -->
		  <el-dialog title="Add RFQ" :visible.sync="dialogFormVisible">
					  <el-form ref="goodsForm" :model="goodsForm" :rules="rules" label-width="160px" style="margin-top:-50px;" >
						 <el-row class="good_detail">
							 <div class="canEdit">
							 	<el-form-item label="Contact" prop="ContactID" style="width:px%;">
							 		<el-col :span="4">
									   <el-select v-model="goodsForm.ContactID" placeholder="Please choose"   filterable clearable>
											  <el-option v-for="(item, index) in ContactList" :key="index" :label="item.ContactName" :value="item.CompanyContactID"></el-option>
									    </el-select>
								    </el-col> 
								    
								    <el-checkbox v-model="goodsForm.Hot" style="margin-left:185px;">Hot</el-checkbox>
								 </el-form-item>
								 
								 <el-form-item label="RequestDate" >
							 		<el-date-picker
								      v-model="goodsForm.RequestDate"
								      type="date"
								      format="yyyy-MM-dd"
								      placeholder="Select date">
								    </el-date-picker>
								    
								     <el-checkbox v-model="goodsForm.OpenPO" style="margin-left:28px;">OpenPO</el-checkbox>
								 </el-form-item>
								 
								<el-form-item label="SalesRep" prop="SalesRepID">
							 		<el-col :span="11">
									   <el-select v-model="goodsForm.SalesRepID" placeholder="Please choose" filterable clearable >
											  <el-option v-for="(item, index) in SalesList" :key="index" :label="item.employeeName" :value="item.employeeID"></el-option>
									    </el-select>
								    </el-col> 
								 </el-form-item> 
								 
								 <el-form-item label="Part" required>
							 		<el-col :span="5.3">
							 		   <el-form-item  prop="BrandID">
										   <el-select v-model="goodsForm.BrandID"  placeholder="Please choose"  filterable clearable>
												  <el-option v-for="(item, index) in BrandList" :key="index" :label="item.BrandName" :value="item.BrandID"></el-option>
										    </el-select>
									    </el-form-item>
									</el-col> 
									
									<el-col :span="15">
									 	<el-form-item prop="PartNo">  
										     <el-input v-model="goodsForm.PartNo"  prop="PartNo" style="clear: left;display:inline;" ></el-input>
										     <el-button type="primary" icon="el-icon-search" @click="searchPart"></el-button>
									     </el-form-item>
								    </el-col> 
								 </el-form-item>
								 
								 <el-form-item label="CustomerPartNo">
								   <el-input v-model="goodsForm.CustomerPartNo"  ></el-input>
								 </el-form-item>
								 <el-form-item label="TargetPrice" class="item-detail">
								   <el-input v-model="goodsForm.TargetPrice" ></el-input>
								 </el-form-item>
								  <el-form-item label="Quantity" class="item-detail"  prop="Quantity">
								   <el-input v-model.number="goodsForm.Quantity" autocomplete="off"></el-input>
								 </el-form-item>
								 <el-form-item label="DateCode" class="item-detail" style="clear: left;">
								   <el-input v-model="goodsForm.DateCode"  ></el-input>
								 </el-form-item>
								 <el-form-item label="Package"  class="item-detail" >
								   <el-input v-model="goodsForm.Package"  ></el-input>
								 </el-form-item>
								
								<el-form-item label="LeadFree" style="clear: left;">
							 		<el-col :span="11">
									   <el-select v-model="goodsForm.LeadFree" placeholder="Please choose" >
									          <el-option label="Any" :value="1"></el-option>
									          <el-option label="LeadFree" :value="2"></el-option>
									          <el-option label="Leaded" :value="3"></el-option>
									          <el-option label="RoHScompliant" :value="4"></el-option>
									          <el-option label="RoHScompliantAndHalo" :value="5"></el-option>  
									          </el-select>
									    </el-select>
								    </el-col> 
								 </el-form-item>
								
								 <el-form-item label="Remarks" >
								    <el-input type="textarea"  :autosize="{ minRows: 2, maxRows: 4}" v-model="goodsForm.Remarks"></el-input>
								 </el-form-item>
							 </div>
						  </el-row>
					  
					  <el-form-item >
					  	 <el-button @click="dialogFormVisible = false">Cancel</el-button>
					     <el-button type="primary"  @click="AddRFQSave('goodsForm')">Save</el-button>
					  
					  </el-form-item>
					</el-form>		  
				</el-dialog>
				
				
				
				<el-dialog title="Edit RFQ" :visible.sync="editdialogFormVisible">
					  <el-form ref="editform" :model="editform" :rules="rules" label-width="160px" style="margin-top:-50px;" >
						 <el-row class="good_detail">
							 <div class="canEdit">
							 	<el-form-item label="Contact" prop="ContactID" style="width:px;">
							 		<el-col :span="4">
									   <el-select v-model="editform.ContactID" placeholder="Please choose"   filterable clearable>
											  <el-option v-for="(item, index) in ContactListEdit" :key="item.CompanyContactID" :label="item.ContactName" :value="item.CompanyContactID"></el-option>
									    </el-select>
								    </el-col> 
								    
								    <el-checkbox v-model="editform.Hot" style="margin-left:185px;">Hot</el-checkbox>
								 </el-form-item>
								 
								 <el-form-item label="RequestDate" >
							 		<el-date-picker
								      v-model="editform.RequestDate"
								      type="date"
								      format="yyyy-MM-dd"
								      placeholder="Select date">
								    </el-date-picker>
								    
								     <el-checkbox v-model="editform.OpenPO" style="margin-left:28px;">OpenPO</el-checkbox>
								 </el-form-item>
								 
								<el-form-item label="SalesRep" prop="SalesRepID">
							 		<el-col :span="11">
									   <el-select v-model="editform.SalesRepID" placeholder="Please choose" filterable clearable >
											  <el-option v-for="(item, index) in SalesList" :key="index" :label="item.employeeName" :value="item.employeeID"></el-option>
									    </el-select>
								    </el-col> 
								 </el-form-item> 
								 
								 <el-form-item label="Part" required>
							 		<el-col :span="5.3">
							 		   <el-form-item  prop="BrandID">
										   <el-select v-model="editform.BrandID"  placeholder="Please choose" disabled  filterable clearable>
												  <el-option v-for="(item, index) in BrandList" :key="index" :label="item.BrandName" :value="item.BrandID"></el-option>
										    </el-select>
									    </el-form-item>
									</el-col> 
									
									<el-col :span="15">
									 	<el-form-item prop="PartNo">  
										     <el-input v-model="editform.PartNo"  prop="PartNo" style="clear: left;display:inline;" disabled ></el-input>
										     <el-button type="primary" icon="el-icon-search" @click="searchPart" disabled></el-button>
									     </el-form-item>
								    </el-col> 
								 </el-form-item>
								 
								 <el-form-item label="CustomerPartNo">
								   <el-input v-model="editform.CustomerPartNo"  ></el-input>
								 </el-form-item>
								 <el-form-item label="TargetPrice" class="item-detail">
								   <el-input v-model="editform.TargetPrice" ></el-input>
								 </el-form-item>
								  <el-form-item label="Quantity" class="item-detail"  prop="Quantity">
								   <el-input v-model.number="editform.Quantity" autocomplete="off"></el-input>
								 </el-form-item>
								 <el-form-item label="DateCode" class="item-detail" style="clear: left;">
								   <el-input v-model="editform.DateCode"  ></el-input>
								 </el-form-item>
								 <el-form-item label="Package"  class="item-detail" >
								   <el-input v-model="editform.Package"  ></el-input>
								 </el-form-item>
								
								<el-form-item label="LeadFree" style="clear: left;">
							 		<el-col :span="11">
									   <el-select v-model="editform.LeadFree" placeholder="Please choose" >
									          <el-option label="Any" :value="1"></el-option>
									          <el-option label="LeadFree" :value="2"></el-option>
									          <el-option label="Leaded" :value="3"></el-option>
									          <el-option label="RoHScompliant" :value="4"></el-option>
									          <el-option label="RoHScompliantAndHalo" :value="5"></el-option>  
									          </el-select>
									    </el-select>
								    </el-col> 
								 </el-form-item>
								
								 <el-form-item label="Remarks" >
								    <el-input type="textarea"  :autosize="{ minRows: 2, maxRows: 4}" v-model="editform.Remarks"></el-input>
								 </el-form-item>
							 </div>
						  </el-row>
					  
					  <el-form-item >
					  	 <el-button @click="dialogFormVisible = false">Cancel</el-button>
					     <el-button type="primary"  @click="EditRFQSave('editform')">Save</el-button>
					  
					  </el-form-item>
					</el-form>	
					  
				</el-dialog>
				
				
					<!-- jkjkjkjk-->
			<el-dialog  title ="Search Part" :visible.sync="dialogTableVisible" customClass="customWidth_50">
				<el-input v-model="partName" placeholder="Search Part Name" style="width:32%;" clearable></el-input>
				
				<el-button type="primary" icon="el-icon-search" @click="partNameSearch">Search</el-button>
			  <el-table :data="tablePartList" style="margin-top:1px;"> 
			   <!-- <el-table-column property="PartNo" label="PartNo" width="220"  @click="openHome(scope.row)"></el-table-column> -->
			   <el-table-column label="PartNo"  align="center" >
				   <template slot-scope="scope" >
						<span @click="openHome(scope.row)" style="cursor:pointer">{{ scope.row.PartNo }}</span>
				    </template>
			   </el-table-column>
				<el-table-column property="BrandAlias" label="Brand Alias" width="200" ></el-table-column>
				<el-table-column property="PartDesc" label="Part Desc" width="150" ></el-table-column>
			  </el-table>
			</el-dialog>
			
			<!-- Add New Quotation 添加询价 -->
				<el-dialog title="Add New Quotation" :visible.sync="quotationformVisible">
						
						<el-form ref="quotationform" :model="quotationform" :rules="quotationRules" label-width="150px" style="margin-top:-50px;" >
							 <el-row class="good_detail">
								 <div class="canEdit">
								 	 <el-form-item label="Part" required>
								 		<el-col :span="5.3">
								 		   <el-form-item  prop="BrandID">
											   <el-select v-model="quotationform.BrandID"  placeholder="Please choose"  filterable clearable>
													  <el-option v-for="(item, index) in BrandList" :key="index" :label="item.BrandName" :value="item.BrandID"></el-option>
											    </el-select>
										    </el-form-item>
										</el-col> 
										
										<el-col :span="15">
										 	<el-form-item prop="PartNo">  
											     <el-input v-model="quotationform.PartNo"  prop="PartNo" style="clear: left;display:inline;" ></el-input>
											     <el-button type="primary" icon="el-icon-search" @click="searchPartQuotation"></el-button>
										     </el-form-item>
									    </el-col> 
									 </el-form-item>
									 
									  <el-form-item label="Vendor" required>
								 		<el-col :span="5.3">
								 		   <el-form-item  prop="VendorID">
											   <el-select v-model="quotationform.VendorID"  placeholder="Please choose" @change="changeQuotationVendor($event)"  filterable clearable>
													  <el-option v-for="(item, index) in VenderList" :key="index" :label="item.CompanyName" :value="item.VendorID"></el-option>
											    </el-select>
										    </el-form-item>
										   </el-col> 
										   
										    <el-col :span="15">
										    	 <el-button type="primary" icon="el-icon-search" @click="searchVendor"></el-button>
										    </el-col> 
										</el-col> 
											    
									 </el-form-item>
								 
								 	<el-form-item label="Contact" prop="ContactID"  >
								 		<el-col :span="4">
										   <el-select v-model="quotationform.ContactID" placeholder="Please choose"   filterable clearable>
												  <el-option v-for="(item, index) in companyContactQuotationList" :key="index" :label="item.ContactName" :value="item.CompanyContactID"></el-option>
										    </el-select>
									    </el-col> 
									 </el-form-item>
									 
									 <div>
									 <el-form-item label="Offer Price"  prop="Price"  class="item-detail" >
									   <el-input v-model="quotationform.Price"  ></el-input>
									 </el-form-item>
									  <el-form-item label="Quantity"  prop="Quantity"  class="item-detail" >
									   <el-input v-model.number="quotationform.Quantity" autocomplete="off"></el-input>
									 </el-form-item>
									 </div>
									 
									 <el-form-item label="DateCode" prop="DateCode"  class="item-detail" >
									   <el-input v-model="quotationform.DateCode"  ></el-input>
									 </el-form-item>
									  <el-form-item label="LeadTime" class="item-detail" prop="LeadTime">
									   <el-input v-model="quotationform.LeadTime" ></el-input>
									 </el-form-item>
									 
									 <el-form-item label="Package"  class="item-detail" >
									   <el-input v-model="quotationform.Package"  ></el-input>
									 </el-form-item>
									  <el-form-item label="Packing"  class="item-detail" >
									   <el-input v-model="quotationform.Packing"  ></el-input>
									 </el-form-item>
									
									<el-form-item label="LeadFree" prop="LeadFree"  class="item-detail" >
								 		<el-col :span="11">
										   <el-select v-model="quotationform.LeadFree" placeholder="Please choose" >
										          <el-option label="Any" :value="1"></el-option>
										          <el-option label="LeadFree" :value="2"></el-option>
										          <el-option label="Leaded" :value="3"></el-option>
										          <el-option label="RoHScompliant" :value="4"></el-option>
										          <el-option label="RoHScompliantAndHalo" :value="5"></el-option>  
										    </el-select>
									    </el-col> 
									 </el-form-item>
									 
									  <el-form-item label="ShipFrom"  class="item-detail" >
									   <el-input v-model="quotationform.ShipFrom"  ></el-input>
									 </el-form-item>
									 
									 <el-form-item label="P/T" prop="PaymentTermID"  class="item-detail" >
								 		<el-col :span="11">
										   <el-select v-model="quotationform.PaymentTermID" placeholder="Please choose" >
										   		  <el-option v-for="(item, index) in PaymentList" :key="index" :label="item.PaymentTerm" :value="item.PaymentTermID"></el-option>
										   </el-select>
									    </el-col> 
									 </el-form-item>
									 
									 <el-form-item label="Vendor Type" prop="VendorType"  class="item-detail" >
								 		<el-col :span="11">
										   <el-select v-model="quotationform.VendorType" placeholder="Please choose" >
										          <el-option label="Broker" :value="1"></el-option>
										          <el-option label="Agent" :value="2"></el-option>
										          <el-option label="Oem" :value="3"></el-option>
										          <el-option label="Manufactor" :value="4"></el-option>
										          <el-option label="Local" :value="5"></el-option>  
										    </el-select>
									    </el-col> 
									 </el-form-item>
									
									 <el-form-item label="Remarks" class="item-detail" >
									    <el-input type="textarea"  :autosize="{ minRows: 2, maxRows: 4}" v-model="quotationform.Remarks"></el-input>
									 </el-form-item>
								 </div>
							  </el-row>
						  
						  <el-form-item >
						  	 <el-button @click="quotationformVisible = false">Cancel</el-button>
						     <el-button type="primary"  @click="AddQuotationSave('quotationform')">Save</el-button>
						  
						  </el-form-item>
						</el-form>	
					</el-dialog>
					
					<!-- Add Quotation  Part Search 询价 Part搜索-->
					<el-dialog  title ="Search Part" :visible.sync="dialogTableQuotationVisible" customClass="customWidth_50">
						<el-input v-model="partName" placeholder="Search Part Name" style="width:32%;" clearable></el-input>
						
					  <el-button type="primary" icon="el-icon-search" @click="partNameQuotationSearch">Search</el-button>
					  <el-button type="primary" icon="el-icon-tickets" @click="AddPartQuotation">Add Part</el-button>
					  
					  <el-table :data="tablePartQuotationList" style="margin-top:1px;"> 
					   <!-- <el-table-column property="PartNo" label="PartNo" width="220"  @click="openHomeQuotation(scope.row)"></el-table-column> -->
					   <el-table-column label="PartNo"  align="center" >
						   <template slot-scope="scope" >
								<span @click="openHomeQuotation(scope.row)" style="cursor:pointer">{{ scope.row.PartNo }}</span>
						    </template>
					   </el-table-column>
						<el-table-column property="BrandAlias" label="Brand Alias" width="200" ></el-table-column>
						<el-table-column property="PartDesc" label="Part Desc" width="150" ></el-table-column>
					  </el-table>
					</el-dialog>
					
					<!--  ADD Part  添加Part-->
					<el-dialog title="Add New Part" :visible.sync="dialogAddPart" >
						  
						  <el-form :model="ruleForm" :rules="rulesPart" ref="ruleForm" label-width="160px">
						     <el-form-item label="PartNo" prop="PartNo" >
							   <el-input v-model="ruleForm.PartNo"  placeholder="PartNo"></el-input>
							 </el-form-item>
							 <el-form-item label="PartDesc" prop="PartDesc">
							   <el-input v-model="ruleForm.PartDesc"  placeholder="PartDesc"></el-input>
							 </el-form-item>
							 
							 <el-form-item label="Brand" prop="BrandID">
							 	<el-select v-model="ruleForm.BrandID" filterable placeholder="请选择">
									  <el-option v-for="(item, index) in BrandList" :key="index" :label="item.BrandName" :value="item.BrandID"></el-option>
							    </el-select>
							 </el-form-item>
							 
							 <el-form-item label="PartType" prop="PartTypeID">
							 	<el-select v-model="ruleForm.PartTypeID" filterable placeholder="请选择">
									  <el-option v-for="(item, index) in PartTypeList" :key="index" :label="item.PartTypeName" :value="item.PartTypeID"></el-option>
							    </el-select>
							 </el-form-item>
						    
						  </el-form>
						  <div slot="footer" class="dialog-footer">
						    <el-button @click="dialogAddPart = false">Cancel</el-button>
						    <el-button type="primary" @click="AddPartsubmitForm('ruleForm')">Save</el-button>
						  </div>
						</el-dialog>
						
					<!-- Vendor 搜索 -->	
							<el-dialog  title ="Search Vendor" :visible.sync="dialogTableVendor" customClass="customWidth_50">
								<el-input v-model="VendorName" placeholder="Search Vendor Name" style="width:32%;" clearable></el-input>
							  <el-button type="primary" icon="el-icon-search" @click="VendorNameQuotationSearch">Search</el-button>
							  <el-table :data="tableVendorList" style="margin-top:1px;"> 
								<el-table-column property="VendorCode" label="Code" width="80" ></el-table-column>
							    <el-table-column label="CompanyName"  align="center" width="220">
								   <template slot-scope="scope" > 
										<span @click="openHomeVendor(scope.row)" style="cursor:pointer">{{ scope.row.CompanyName }}</span>
								   </template>
							    </el-table-column>
							   <el-table-column property="CompanyAlias" label="Alias" width="200" ></el-table-column>
								<el-table-column property="State" label="Region" width="80" ></el-table-column>
								<el-table-column property="CountryName" label="Country" width="100" ></el-table-column>
								<el-table-column property="LastOrderDate" label="OrderDate" width="100" ></el-table-column>
								<el-table-column property="LastContactDate" label="ContactDate" width="110" ></el-table-column>
								<el-table-column property="OrderNum" label="OrderNum" width="100" ></el-table-column>
								<el-table-column property="QuoteNum" label="QuoteNum" width="100" ></el-table-column>
								<el-table-column property="CompanyAddress" label="CompanyAddress" width="150" ></el-table-column>
								
							  </el-table>
							</el-dialog>	
						
					<!-- Add Sales Quotation 销售询价-->
				    <el-dialog title="Add New Sales Quotation" :visible.sync="SalesquotationformVisible">
						<el-form ref="Salesquotationform" :model="Salesquotationform" :rules="SalesquotationRules" label-width="150px" style="margin-top:-50px;" >
							 <el-row class="good_detail">
								 <div class="canEdit">
								 	 <el-form-item label="Part" required>
								 		<el-col :span="5.3">
								 		   <el-form-item  prop="BrandID">
											   <el-select v-model="Salesquotationform.BrandID"  placeholder="Please choose"  filterable clearable>
													  <el-option v-for="(item, index) in BrandList" :key="index" :label="item.BrandName" :value="item.BrandID"></el-option>
											    </el-select>
										    </el-form-item>
										</el-col> 
										
										<el-col :span="15">
										 	<el-form-item prop="PartNo">  
											     <el-input v-model="Salesquotationform.PartNo"  prop="PartNo" style="clear: left;display:inline;" ></el-input>
											     <el-button type="primary" icon="el-icon-search" @click="searchPartSalesQuotation"></el-button>
										     </el-form-item>
									    </el-col> 
									 </el-form-item>
								 
								    <el-form-item label="CustomerPartNO"   >
									   <el-input v-model="Salesquotationform.CustomerPartNo"  ></el-input>
									 </el-form-item>
									 
									  <el-form-item label="Customer"   >
									   <el-input v-model.number="Salesquotationform.CompanyName" autocomplete="off" disabled></el-input>
									 </el-form-item>
								 									 
									 <div>
									 <el-form-item label="Sell Price"  prop="SellPrice"  class="item-detail" >
									   <el-input v-model="Salesquotationform.SellPrice"  ></el-input>
									 </el-form-item>
									  <el-form-item label="Quantity"  prop="Quantity"  class="item-detail" >
									   <el-input v-model.number="Salesquotationform.Quantity" autocomplete="off"></el-input>
									 </el-form-item>
									 </div>
									 
									 <el-form-item label="DateCode"   class="item-detail" >
									   <el-input v-model="Salesquotationform.DateCode"  ></el-input>
									 </el-form-item>
									  <el-form-item label="SellQty"  prop="SellQty"  class="item-detail" >
									   <el-input v-model.number="Salesquotationform.SellQty" autocomplete="off" ></el-input>
									 </el-form-item>
									 
									 <el-form-item label="Package"  class="item-detail" >
									   <el-input v-model="Salesquotationform.Package"  ></el-input>
									 </el-form-item>
									 <el-form-item label="ShipFrom"  class="item-detail" >
									   <el-input v-model="Salesquotationform.ShipFrom"  ></el-input>
									 </el-form-item>
									<el-form-item label="LeadFree" prop="LeadFree"  class="item-detail" >
								 		<el-col :span="11">
										   <el-select v-model="Salesquotationform.LeadFree" placeholder="Please choose" >
										          <el-option label="Any" :value="1"></el-option>
										          <el-option label="LeadFree" :value="2"></el-option>
										          <el-option label="Leaded" :value="3"></el-option>
										          <el-option label="RoHScompliant" :value="4"></el-option>
										          <el-option label="RoHScompliantAndHalo" :value="5"></el-option>  
										    </el-select>
									    </el-col> 
									 </el-form-item>
									 
									  <el-form-item label="LeadTime" class="item-detail" prop="LeadTime">
									   <el-input v-model="Salesquotationform.LeadTime" ></el-input>
									 </el-form-item>
									
									 <el-form-item label="Remarks" class="item-detail" >
									    <el-input type="textarea"  :autosize="{ minRows: 2, maxRows: 4}" v-model="Salesquotationform.Remarks"></el-input>
									 </el-form-item>
								 </div>
							  </el-row>
						  
						  <el-form-item >
						  	 <el-button @click="SalesquotationformVisible = false">Cancel</el-button>
						     <el-button type="primary"  @click="AddSalesQuotationSave('Salesquotationform')">Save</el-button>
						  </el-form-item>
						</el-form>	
					</el-dialog>
			
		<!-- 下面选项卡 -->
		  <el-tabs type="border-card" v-show="dialogtab"> 
			  <el-tab-pane label="Tracking">
			  		<template>
						<div class="spread con customer_index">
								<div style="margin-top:-8px;">
									<el-button  type="danger" icon="el-icon-tickets" @click="AddTracking()" >Add Tracking</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="DeleteTracking()">Delete Tracking</el-button>
								</div>
							<el-table 
								v-loading="loading"
								element-loading-text="Loading"
							    :data="tableDataTracking"
							    style="width: 100%"
								:height="tableHeight"
							    border
							    fit
							    highlight-current-row
					    		@current-change="TrackingCurrentChange"
							   >
							    <el-table-column
							      label="TrackingType" width="150">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.TrackingTypeName }}</span>
							      	</template>
							    </el-table-column>
							    
							    <el-table-column
							      label="Buyer" width="150">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.PurchRepIDName }}</span>
							      	</template>
							    </el-table-column>
							    
							    <el-table-column
							      label="Tracking Status" width="200">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.RFQStatusName }}</span>
							      	</template>
							    </el-table-column>
							    
							    <el-table-column
							      label="Active"  width="100">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.inActiveName }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Created Date"  width="200">
							      	<template slot-scope="scope">
							        	<span >{{ objTimeString(scope.row.CreatedDate) }}</span>
							      	</template>
							    </el-table-column>
							   <el-table-column
							      label="Updated Date" width="200 ">
							      	<template slot-scope="scope">
							        	<span >{{ objTimeString(scope.row.UpdatedDate) }}</span>
							      	</template>
							    </el-table-column>
							  </el-table>
							  
							   <!-- Tracking ADD  -->
								   <el-dialog title="Add Tracking" :visible.sync="dialogAddTracking">
									  <el-form>
								  	 	 <el-form-item >
									  		 <el-checkbox-group v-model="BuyerRep">
									     	 	<el-checkbox v-for="(item,index) in BuyerRepList"  v-model="item.employeeID" :label="item.employeeID" :key="item.employeeID">{{item.employeeName}}</el-checkbox>
										     </el-checkbox-group>   
										  </el-form-item>
										  
										  	<el-form-item>
										    	<el-button type="primary" @click="AddTrackingSave">Save</el-button>
										    	<el-button  @click="dialogAddTracking = false">Cancel</el-button>
										  	</el-form-item>
										</el-form>
								</el-dialog>
						 </div>
					</template>
			  </el-tab-pane>
			  
			  <!-- Calls -->
			  <el-tab-pane label="Calls">
			  		<template>
						<div class="spread con customer_index">
								<div style="margin-top:-8px;">
									<!--<el-button  type="danger" icon="el-icon-tickets" @click="callEdit()" >Edit</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="NoStock()">No Stock</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="NoList()" >No List</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="Wait()">Wait</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="SeeQuote()" >See Quote</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="DeleteCall()">Delete Call</el-button> -->
								</div>
							<el-table 
								v-loading="loading"
								element-loading-text="Loading"
							    :data="tableDataCalls"
							    style="width: 100%"
								:height="tableHeight"
							    border
							    fit
							    highlight-current-row
					    		@current-change="CallsCurrentChange"
							   >
							    <el-table-column
							      label="Status" width="100">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.StatusName }}</span>
							      	</template>
							    </el-table-column>
							    
							    <el-table-column
							      label="BrandName" width="120">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.BrandName }}</span>
							      	</template>
							    </el-table-column>
							    
							    <el-table-column
							      label="PartNo" width="210">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.PartNo }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="CompanyName"  width="160">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.CompanyName }}</span>
							      	</template>
							    </el-table-column>
							     <el-table-column
							      label="ContactName"  width="210">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.ContactName }}</span>
							      	</template>
							    </el-table-column>
							    
							    <el-table-column
							      label="RepName"  width="120">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.employeeName }}</span>
							      	</template>
							    </el-table-column>
							     <el-table-column
							      label="VistType"  width="100">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.VisitTypeName }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Contact Record"  width="160">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.ContactRecord }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="ContactTime"  width="200">
							      	<template slot-scope="scope">
							        	<span >{{ objTimeString(scope.row.ContactTime) }}</span>
							      	</template>
							    </el-table-column>
							  </el-table>
						 </div>
					</template>
			  </el-tab-pane>
			  
			  <!-- New Vender Call -->
			  <el-tab-pane label="New Vender Call">
			  		<template>
						<div class="spread con customer_index">
								<div style="margin-top:-8px;">
									<el-button  type="danger" icon="el-icon-document-add" @click="addContact()">Add Contact</el-button>
									<!--<el-button  type="danger" icon="el-icon-edit" @click="EditContact()" >Edit Contact</el-button>  -->
									<el-button  type="primary" icon="el-icon-folder-checked" @click="SaveCall('form')" >Save Call</el-button>
								</div>
								
								<div style="margin-bottom:-25px">
									 <el-form  :inline="true" :model="form" :rules="vendorRules" ref="form" >
											<el-form-item label="Vendor" prop="VendorID"  >
											  <el-select v-model="form.VendorID" placeholder="Please choose" filterable clearable  @change="changeVender($event)" >
												  <el-option v-for="(item, index) in VenderList" :key="index" :label="item.CompanyName" :value="item.VendorID"></el-option>
											  </el-select>
											  <el-button type="primary" icon="el-icon-search" @click="searchVendorContact"></el-button>
											</el-form-item>
											
											<el-form-item label="VisitType" prop="VisitType"  >
											  <el-select v-model="form.VisitType" placeholder="Please choose"  filterable clearable >
											  		<el-option label="Phone" :value="1"></el-option>
													<el-option label="Email" :value="2"></el-option>
													<el-option label="Fax" :value="3"></el-option>
											  		<el-option label="Visit" :value="4"></el-option>
													<el-option label="Msn" :value="5"></el-option>
													<el-option label="Web" :value="6"></el-option>
													<el-option label="Unspecified" :value="9"></el-option>
											  </el-select>
											</el-form-item>
											
											<el-form-item label="Result" prop="Status" >
											  <el-select v-model="form.Status" placeholder="Please choose"  filterable clearable >
											  		<el-option label="Draft" :value="1"></el-option>
													<el-option label="SeeQuote" :value="3"></el-option>
													<el-option label="Wait" :value="4"></el-option>
											  		<el-option label="NOStock" :value="5"></el-option>
													<el-option label="NOList" :value="6"></el-option>
													<el-option label="SendEmail" :value="7"></el-option>
											  </el-select>
											</el-form-item>
											<el-form-item label="ContactRecord" >
													 <el-input v-model="form.ContactRecord"></el-input>
											</el-form-item>
									 </el-form>
								</div>
							<el-table 
								v-loading="loading"
								element-loading-text="Loading"
							    :data="companyContactList"
							    style="width: 100%"
								:height="tableHeight"
							    border
							    fit
							    highlight-current-row
					    		@current-change="companyContactCurrentChange"
					    		v-show="newVenderTable"
							   >
							    <el-table-column
							      label="Contact" width="150">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.ContactName }}</span>
							      	</template>
							    </el-table-column>
							    
							    <el-table-column
							      label="Phone1" width="150">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.Phone1 }}</span>
							      	</template>
							    </el-table-column>
							    
							     <el-table-column
							      label="Mobile1"  width="150">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.Mobile1 }}</span>
							      	</template>
							    </el-table-column>
							    
							     <el-table-column
							      label="Status"  width="120">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.StatusName }}</span>
							      	</template>
							    </el-table-column>
							    
							    <el-table-column
							      label="Phone2" width="120">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.Phone2 }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Email"  width="180">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.Email }}</span>
							      	</template>
							    </el-table-column>
							     <el-table-column
							      label="Fax"  width="100">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.Fax }}</span>
							      	</template>
							    </el-table-column>
							     <el-table-column
							      label="AddressLine"  width="140">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.AddressLine }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Department"  width="120">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.Department }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="JobTitle"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ (scope.row.JobTitle) }}</span>
							      	</template>
							    </el-table-column>
							  </el-table>
							  
							  
							<!-- contacts ADD  添加联系人 -->
								   <el-dialog title="Add New Contact" :visible.sync="AddContactVisible">
									  <el-form :model="Contactform" :rules="rulesContact" ref="Contactform" >
									     <el-form-item label="ContactName"  prop="ContactName" :label-width="formLabelWidth">
									      <el-input v-model="Contactform.ContactName"></el-input>
									    </el-form-item>
									    
									    <el-form-item label="Gender" prop="Gender" :label-width="formLabelWidth">
									      <el-select v-model="Contactform.Gender" placeholder="Please choose"  >
									      	  <el-option label="NoInfo" :value="1"></el-option>
											  <el-option label="Mr" :value="2"></el-option>
								              <el-option label="Ms" :value="3"></el-option>
								              <el-option label="Mrs" :value="4"></el-option>
									      </el-select>
									    </el-form-item>
									    
									    <el-form-item label="Nickname" :label-width="formLabelWidth">
									      <el-input v-model="Contactform.Nickname" ></el-input>
									    </el-form-item>
									    <el-form-item label="JobTitle" :label-width="formLabelWidth">
									      <el-input v-model="Contactform.JobTitle" ></el-input>
									    </el-form-item>
									    <el-form-item label="Department" :label-width="formLabelWidth">
									      <el-input v-model="Contactform.Department" ></el-input>
									    </el-form-item>
									    <el-form-item label="Phone1"  prop="Phone1"  :label-width="formLabelWidth">
									      <el-input v-model="Contactform.Phone1" ></el-input>
									    </el-form-item>
									    <el-form-item label="Phone2" :label-width="formLabelWidth">
									      <el-input v-model="Contactform.Phone2"></el-input>
									    </el-form-item>
									    <el-form-item label="Fax" :label-width="formLabelWidth">
									      <el-input v-model="Contactform.Fax" ></el-input>
									    </el-form-item>
									     
									    <el-form-item label="Mobile1" :label-width="formLabelWidth">
									      <el-input v-model="Contactform.Mobile1" ></el-input>
									    </el-form-item>
									    <el-form-item label="Mobile2" :label-width="formLabelWidth">
									      <el-input v-model="Contactform.Mobile2" ></el-input>
									    </el-form-item>
									     
									    <el-form-item label="Email" prop="Email"  :label-width="formLabelWidth">
									      <el-input v-model="Contactform.Email" ></el-input>
									    </el-form-item>
									   <el-form-item label="PersonalEmail" :label-width="formLabelWidth">
									      <el-input v-model="Contactform.PersonalEmail" ></el-input>
									    </el-form-item>
									    <el-form-item label="IMAddress" :label-width="formLabelWidth">
									      <el-input v-model="Contactform.IMAddress" ></el-input>
									    </el-form-item>
									    <el-form-item label="AddressLine" :label-width="formLabelWidth">
									      <el-input v-model="Contactform.AddressLine" ></el-input>
									    </el-form-item>
									    
									  </el-form>
									  <div slot="footer" class="dialog-footer">
									    <el-button @click="AddContactVisible = false">Cancel</el-button>
									    <el-button type="primary"  @click="contactsubmitForm('Contactform')">Save</el-button>
									  </div>
								</el-dialog>
								
								
						<!-- Vendor 搜索  添加联系人-->	
							<el-dialog  title ="Search Vendor" :visible.sync="dialogTableVendorContact" customClass="customWidth_50">
								<el-input v-model="VendorName" placeholder="Search Vendor Name" style="width:32%;" clearable></el-input>
							  <el-button type="primary" icon="el-icon-search" @click="VendorNameQuotationContactSearch">Search</el-button>
							  <el-table :data="tableVendorContactList" style="margin-top:1px;"> 
								<el-table-column property="VendorCode" label="Code" width="80" ></el-table-column>
							    <el-table-column label="CompanyName"  align="center" width="220">
								   <template slot-scope="scope" > 
										<span @click="openHomeVendorContact(scope.row)" style="cursor:pointer">{{ scope.row.CompanyName }}</span>
								   </template>
							    </el-table-column>
							   <el-table-column property="CompanyAlias" label="Alias" width="200" ></el-table-column>
								<el-table-column property="State" label="Region" width="80" ></el-table-column>
								<el-table-column property="CountryName" label="Country" width="100" ></el-table-column>
								<el-table-column property="LastOrderDate" label="OrderDate" width="100" ></el-table-column>
								<el-table-column property="LastContactDate" label="ContactDate" width="110" ></el-table-column>
								<el-table-column property="OrderNum" label="OrderNum" width="100" ></el-table-column>
								<el-table-column property="QuoteNum" label="QuoteNum" width="100" ></el-table-column>
								<el-table-column property="CompanyAddress" label="CompanyAddress" width="150" ></el-table-column>
								
							  </el-table>
							</el-dialog>	
							  
						 </div>
					</template>
			  </el-tab-pane>
			  
			  <!-- Quotations 询价列表 -->
			  <el-tab-pane label="Quotation">
			  		<template>
						<div class="spread con customer_index">
								<div style="margin-top:-8px;">
									<!--<el-button  type="danger" icon="el-icon-tickets" @click="callEdit()" >Edit</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="NoStock()">No Stock</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="NoList()" >No List</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="Wait()">Wait</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="SeeQuote()" >See Quote</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="DeleteCall()">Delete Call</el-button> -->
								</div>
							<el-table 
								v-loading="loading"
								element-loading-text="Loading"
							    :data="QuotationList"
							    style="width: 100%"
								:height="tableHeight"
							    border
							    fit
							    highlight-current-row
					    		@current-change="QuotationCurrentChange"
							   >
							    <el-table-column
							      label="Status" width="80">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.StatusName }}</span>
							      	</template>
							    </el-table-column>
							    
							    <el-table-column
							      label="Buyer" width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.employeeName }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Vendor"  width="160">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.CompanyName }}</span>
							      	</template>
							    </el-table-column>
							     <el-table-column
							      label="Contact"  width="160">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.ContactName }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Brand"  width="160">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.BrandName }}</span>
							      	</template>
							    </el-table-column>
							    
							     <el-table-column
							      label="PartNo"  width="160">
							      	<template slot-scope="scope">
							        	<span v-if="scope.row.PartNoColor ==1" style="color:red;">{{ scope.row.PartNo }}</span>
							        	<span v-else >{{ scope.row.PartNo }}</span>
							      	</template>
							    </el-table-column>
							    
							    <el-table-column
							      label="BuyPrice"  width="100">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.Price }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Quantity"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.Quantity }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="D/C"  width="80">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.DateCode }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="LeadFree"  width="90">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.LeadFreeName }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="LeadTime"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.LeadTime }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="P/T"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.PaymentTerm }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Package"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.Package }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Packing"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.Packing }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="ShipFrom"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.ShipFrom }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="CreatedDate" width="120">
							      	<template slot-scope="scope">
							        	<span>{{ objTimeString(scope.row.CreatedDate) }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="VendorClassList"  width="160">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.VendorClassList }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="reamrk"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.Remarks }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="FreeQty"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.FreeQty }}</span>
							      	</template>
							    </el-table-column>
							  </el-table>
						 </div>
					</template>

			  </el-tab-pane>
			  
			  <!-- Others Quotations 其他询价列表-->
			  <el-tab-pane label="Others Quotation">
			  		<template>
						<div class="spread con customer_index">
								<div style="margin-top:-8px;">
									<!--<el-button  type="danger" icon="el-icon-tickets" @click="callEdit()" >Edit</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="NoStock()">No Stock</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="NoList()" >No List</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="Wait()">Wait</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="SeeQuote()" >See Quote</el-button>
									<el-button  type="danger" icon="el-icon-tickets" @click="DeleteCall()">Delete Call</el-button> -->
								</div>
							<el-table 
								element-loading-text="Loading"
							    :data="OtherQuotationList"
							    style="width: 100%"
								:height="tableHeight"
							    border
							    fit
							    highlight-current-row
					    		@current-change="OtherQuotationCurrentChange"
							   >
							    <el-table-column
							      label="Status" width="80">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.StatusName }}</span>
							      	</template>
							    </el-table-column>
							    
							    <el-table-column
							      label="Buyer" width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.employeeName }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Vendor"  width="160">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.CompanyName }}</span>
							      	</template>
							    </el-table-column>
							     <el-table-column
							      label="Contact"  width="160">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.ContactName }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Brand"  width="160">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.BrandName }}</span>
							      	</template>
							    </el-table-column>
							     <el-table-column
							      label="PartNo"  width="160">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.PartNo }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="BuyPrice"  width="100">
							      	<template slot-scope="scope">
							        	<span>{{ scope.row.Price }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Quantity"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.Quantity }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="D/C"  width="80">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.DateCode }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="LeadFree"  width="90">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.LeadFreeName }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="LeadTime"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.LeadTime }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="P/T"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.PaymentTerm }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Package"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.Package }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="Packing"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.Packing }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="ShipFrom"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.ShipFrom }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="CreatedDate" width="120">
							      	<template slot-scope="scope">
							        	<span>{{ objTimeString(scope.row.CreatedDate) }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="VendorClassList"  width="160">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.VendorClassList }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="reamrk"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.Remarks }}</span>
							      	</template>
							    </el-table-column>
							    <el-table-column
							      label="FreeQty"  width="100">
							      	<template slot-scope="scope">
							        	<span >{{ scope.row.FreeQty }}</span>
							      	</template>
							    </el-table-column>
							  </el-table>
						 </div>
					</template>

			  </el-tab-pane>
			  
			 <!--  <el-tab-pane label="定时任务补偿">定时任务补偿</el-tab-pane> -->
		</el-tabs>
		
		
				 
	</div>
</template>

<script type="text/javascript">
export default {
	data() {
		var sdDate = [];
		return {
			loading: false,
			tableData: [],
			tableHeight: 350,
			token: '',
			keyword: '',
			PurchOrderNo:'',
			rantime:[],
			currentRow: [],
			arr: [],
			SalesList:[],
			BuyerList:[],
			salesId:'',
			buyerId:'',
			vendorItem:{},
			item:{},
			
			Bom:false,
			Hot:false,
			Active:true,
			Brief:true,
			listQuery: { sortby: '', order: 'desc' },
			fileDwonload: false,
			url: '',
			btt: [],
			
			tableDataTracking:[],
			currentRowTracking:[],
			dialogAddTracking:false,
			BuyerRep:[],
			BuyerRepList:[],
			
			tableDataCalls:[],
			currentRowCalls:[],
			
			tableDataVenderCall:[],
			currentRowVenderCall:[],
			currentRowCompanyContact:[],
			newVenderTable:true,
			VenderList:[],
			companyContactList:[],
			
			currentRowQuotation:[],
			QuotationList:[],
			OtherQuotationList:[],
			currentRowOtherQuotation:[],
			
			goodsForm: {
		     		ContactID:'',
					RequestDate:'',
					SalesRepID:'',
					PartID:'',
				    PartNo:'',
					CustomerPartNo:'',
					TargetPrice:0,
					Quantity:'',
					DateCode:'',
					Package:'',
					LeadFree: 1,
					Remarks:'',
					Hot:false,
					OpenPO:false,
					BrandID:'',
					param:'',
	      			CustomerID:'',
	      			CompanyID:'',
	      },
	      editform:{
	     	 		ContactID:'',
					RequestDate:'',
					SalesRepID:'',
					PartID:'',
				    PartNo:'',
					CustomerPartNo:'',
					TargetPrice:0,
					Quantity:'',
					DateCode:'',
					Package:'',
					LeadFree: 1,
					Remarks:'',
					Hot:false,
					OpenPO:false,
					BrandID:'',
					param:'',
	      			CustomerID:'',
	      			CompanyID:'',
	      },
	      form:{
	      		VendorID:'',
	      		VisitType:'',
	      		Status:'',
	      		ContactRecord:'',
	      		
	      },
	      ContactList:[],
	      SalesRepList:[],
	      BrandList:[],
	      tablePartList:[],
	      tablePartQuotationList:[],
	      dialogFormVisible: false,
		  editdialogFormVisible:false,
	      formLabelWidth: '160px',
	      CompanyID:'',
	      partName:'',
	      dialogTableVisible:false,
	      dialogtab:false,
	      ContactListEdit:[],
	      
	      vendorCompanyID:'',
	      quotationformVisible:false,
 		  quotationform:{
 		  			PartID:'',
 		  			PartNo:'',
 		  			BrandID:'',
 		  			VendorID:'',
 		  			ContactID:'',
 		  			RFQID:'',
 		  			Quantity:'',
 		  			Price:0,
 		  			DateCode:'',
 		  			Leadtime:'',
 		  			Packing:'',
 		  			Package:'',
 		  			LeadFree:'',
 		  			ShipFrom:'',
 		  			PaymentTermID:'',
 		  			Remarks:'',
 		  			Partparam:'',
 		  			vendorparam:'',
 		  			type:0,
 		  			},
	      PaymentList:[],
	      dialogTableQuotationVisible:false,
	      dialogAddPart:false,
	      ruleForm:{
					PartNo: '',
					PartDesc:'',
					PartTypeID:'',
					BrandID:'',
					NonStockPart:0,
					isPBF:0,
					isROHSOK:0,
					
				},
	      PartTypeList:[],
	      dialogTableVendor:false,
	      VendorName:'',
	      VendorNameID:'',
	      tableVendorList:[],
	      VendorID:'',
	      SalesquotationformVisible:false,
	      Salesquotationform:{
	      			PartID:'',
 		  			PartNo:'',
 		  			BrandID:'',
 		  			RFQID:'',
 		  			CustomerPartNo:'',
 		  			CompanyName:'',
 		  			SellPrice:'',
 		  			Quantity:0,
 		  			DateCode:'',
 		  			SellQty:'',
 		  			Package:'',
 		  			ShipFrom:'',
 		  			LeadFree:'',
 		  			LeadTime:'',
 		  			Remarks:'',
 		  			type:0,
	      			
	      			},
	      			
	      AddContactVisible:false,
	      Contactform:{
	      			ContactName:'',
					Gender:1,
					Nickname:'',
					JobTitle:'',
					Department:'',
					Phone1:'',
					Phone2:'',
					Fax:'',
					Mobile1:'',
					Mobile2:'',
					Email:'',
					PersonalEmail:'',
					IMAddress:'',
					AddressLine:'',
	      			
	      			
	      			},
	      tableVendorContactList:[],
	      dialogTableVendorContact:false,	
	      			
	      			
	      rulesContact:{
				       ContactName: [
				            { required: true, message: 'Please enter ContactName', trigger: 'blur' },
				            { min: 2, max: 55, message: '3 to 55 characters in length', trigger: 'blur' }
				          ],
			           Gender: [
				            { required: true, message: 'Please choose Gender', trigger: 'change' }
				          ],      
				     Phone1: [
				             { required: true, message: 'Please enter Phone1', trigger: 'blur' },
						     { min: 7, max: 20, message: '7 to 20 characters in length', trigger: 'blur' }
				          ],  
				      Email: [
				             { required: true, message: 'Please enter Email', trigger: 'blur' },
						     { min: 3, max: 55, message: '3 to 55 characters in length', trigger: 'blur' }
				          ],
				          
				      
				      },
	      rules: {
	      			 ContactID: [
				            { required: true, message: 'Please choose Contact', trigger: 'change' }
				          ], 
				     SalesRepID:[
				     		{ required: true, message: 'Please choose SalesRep', trigger: 'change' }
				     		],     
				     BrandID: [
				            { required: true, message: 'Please choose Brand', trigger: 'change' }
				          ],
			         PartNo: [
				            { required: true, message: 'Please input PartNo', trigger: 'blur' },
							{ min: 2, max: 500, message: '2 to 500 characters in length', trigger: 'blur' }
				          ],   
				     Quantity:[
        			  		{  required: true, message: ' Cannot be empty' },
        			  		{  type: 'number', message: 'Must be a numeric value' },
        			 	  ],
	      
	      		},
	      		
	      	vendorRules:{
	      				 VendorID: [
				            { required: true, message: 'Please choose  Vendor', trigger: 'change' }
				          ], 
				         VisitType: [
				            { required: true, message: 'Please choose VisitType', trigger: 'change' }
				          ], 
				         Status: [
				            { required: true, message: 'Please choose  Result', trigger: 'change' }
				          ], 
	      	
	      				},
	      	quotationRules:{
	      				BrandID: [
						            { required: true, message: 'Please choose  Brand', trigger: 'change' }
						          ], 
	      				 VendorID: [
						            { required: true, message: 'Please choose  Vendor', trigger: 'change' }
						          ], 
				          ContactID: [
						              { required: true, message: 'Please choose  Contact', trigger: 'change' }
						         	], 
	      				 Price: [
					            { required: true, message: 'Please input OfferPrice', trigger: 'blur' },
								{ min: 1, max: 50, message: '1to50 characters in length', trigger: 'blur' }
					          ],
					      Quantity:[
	        			  		{  required: true, message: ' Cannot be empty' },
	        			  		{  type: 'number', message: 'Must be a numeric value' },
	        			 	  ],
			            LeadFree: [
						            { required: true, message: 'Please choose LeadFree', trigger: 'change' }
						          ],
			            PaymentTermID: [
						            { required: true, message: 'Please choose P/T', trigger: 'change' }
						          ],
				         VendorType: [
						            { required: true, message: 'Please choose VendorType', trigger: 'change' }
						          ], 
	      				 PartNo: [
				            { required: true, message: 'Please input PartNo', trigger: 'blur' },
							{ min: 1, max: 500, message: '1 to 500 characters in length', trigger: 'blur' }
				          ],
				          
	      				
	      				},	
	      	SalesquotationRules:{
	      				BrandID: [
						            { required: true, message: 'Please choose  Brand', trigger: 'change' }
						          ], 
	      				 Quantity:[
	        			  		{  required: true, message: ' Cannot be empty' },
	        			  		{  type: 'number', message: 'Must be a numeric value' },
	        			 	  ],
	        			 SellQty:[
	        			  		{  required: true, message: ' Cannot be empty' },
	        			  		{  type: 'number', message: 'Must be a numeric value' },
	        			 	  ],
	        			 LeadFree: [
						            { required: true, message: 'Please choose LeadFree', trigger: 'change' }
						          ],	  
	        			  SellPrice: [
					            { required: true, message: 'Please input SellPrice', trigger: 'blur' },
								{ min: 1, max: 50, message: '1to50 characters in length', trigger: 'blur' }
					          ],	  
	        			 	  
	      				
	      				},
	      	rulesPart:{
        			PartNo: [
				            { required: true, message: 'Please input PartNo', trigger: 'blur' },
							{ min: 2, max: 500, message: '2 to 500 characters in length', trigger: 'blur' }
				          ],  
        			 BrandID: [
				            { required: true, message: 'Please choose Brand', trigger: 'change' }
				          ],
        			PartTypeID: [
				            { required: true, message: 'Please choose PartType', trigger: 'change' }
				          ],
        		
        		},
	      	companyContactQuotationList:[],
	      							
			page: {
				total: 0,
				size: 1,
				currentPage: 1,
				num: 1
			},
			sort: 1
		};
	},

	created() {
		this.token = window.axios.defaults.headers.common['X-CSRF-TOKEN'];
		this.getBrandList();
		this.getPartType();
		this.getPaymentTerm();
		//this.getContactList();
		this.getSalesRepList();
		this.getTime();
		//this.getSalesList();
		this.getBuyerList();
		this.getPurchOrderList();
		this.venderList();
	},
	mounted() {
		// 动态设置表格高度适应窗口
		window.onresize = () => {
			let a = window.innerHeight;
			//that.tableHeight = a - 403;
		};
	//	this.EditRFQ();
		
	},
	methods: {
		getPurchOrderList(){
			this.loading = true;
			axios
				.get('/api/purchase/purchRFQ?keyword=' +this.PurchOrderNo +'&page=' +this.page.num + '&Bom='+this.Bom+ '&Hot='+this.Hot
				+'&Active='+this.Active+ '&salesId='+this.salesId+'&buyerId='+this.buyerId+'&time='+this.rantime).then(result => {
					if (result.data.code == 200) {
						this.tableData = result.data.result.data;
						//this.page.total = result.data.result.total;
						//this.page.size = result.data.result.per_page; 
						//this.page.per_page = result.data.result.last_page;
						
						this.page.total = result.data.total;
						//this.page.size = result.data.size;
						this.page.per_page = result.data.last_page;
						this.loading = false;
					} else {
						this.$notify.error({
							title: 'Fail',
							message: result.data.message
						});
					}
				})
				.catch(error => {
					this.$notify.error({
						title: 'Fail',
						message: 'ERROR'
					});
				});
		},
		
		detail() {
			if (this.currentRow.length <= 0) {
				this.$notify({ type: 'error', message: 'Please choose one line.' });
				return false;
			}
			// 关闭跳转
			this.$router.push({ path: '/venderdetail?VendorID=' +this.currentRow.VendorID });
		},
		/*getSalesList(){
			axios.get('/api/getsalesRep').then(result => {
				this.SalesList = result.data.result;
			})
			
			},*/
		getBuyerList(){
			axios.get('/api/getBuyerRep').then(result => {
				this.BuyerList = result.data.result;
			})
		
		},	
		vendorDel(){
			if (this.currentRow.length <= 0) {
				this.$notify({ type: 'error', message: 'Please choose one line.' });
				return false;
			}
		axios.post('/api/customer/venderdel', {
							VendorID  : this.currentRow.VendorID,
						  })
						  .then(res => {
							if(res.data.code ==200){
								this.$notify({
								  title: 'Success',
								  message: res.data.message,
								  type: 'success'
								});
								this.getPurchOrderList();
								
							}
						  	
						  })
						  .catch(error => {
							  this.$notify.error({
							    title: 'Fail',
							    message: 'ERROR',
							  });
						  })
		
		},
		handerSearch() {
			this.page.num = 1;
			this.getPurchOrderList();
		},

		handleCurrentChange(val) {
			this.page.num = val;
			this.getPurchOrderList()
		},
		
		shandleCurrentChange(data) {
			this.currentRow = data;
		},
		SetHot(){
			if (this.currentRow.length<= 0) {
				this.$notify({ type: 'error', message: 'Please choose one line.' });
				return false;
			}
	    	var RFQID = this.currentRow.RFQID;
	    	var SalesRepID = this.currentRow.SalesRepID; 
	    	var Hot = this.currentRow.Hot;
	    	axios.get('/api/purchase/setHot?RFQID='+RFQID+'&Hot='+Hot+'&SalesRepID='+SalesRepID).then(result => {
						if (result.data.code == 200) {
							this.$message.success({
								title: 'Success',
								message: result.data.message
							});
							this.getPurchOrderList();
						} else {
							this.$message.error({
								title: 'Error',
								message: result.data.message
							});
						}
					})
		},
		
		AddRFQ(){
			if (this.currentRow.length<= 0) {
				this.$notify({ type: 'error', message: 'Please choose one line.' });
				return false;
			}
			this.CompanyID = this.currentRow.CompanyID;
			this.goodsForm.CompanyID=this.currentRow.CompanyID;
			this.goodsForm.CustomerID=this.currentRow.CustomerID;
			
   			this.dialogFormVisible = true;
   			axios.get('/api/companycontact?CompanyID='+this.CompanyID).then(result => {
					this.ContactList = result.data.result;
				});
		},
		AddRFQSave(formName){
			 this.$refs[formName].validate((valid) => {
		          if (valid) {
		          	axios.post('/api/customer/rfqadd',{
		          		pagram:this.goodsForm,
						CompanyID:this.goodsForm.CompanyID,
		         	 	CustomerID:this.goodsForm.CustomerID
		          	})
					.then(result => {
						if (result.data.code == 200) {
						this.$notify.success({
							title: 'Success',
							message: result.data.message
						});
						setTimeout(() => {	
									this.dialogFormVisible=false;
									this.getPurchOrderList();
									 // this.$router.push({ path: '/api/style/detail?dd='+JSON.stringify(this.currentRow)})
								},1000);
						
						
							} else {
								this.$notify.error({
									title: 'Fail',
									message: result.data.message
								});
							}
								
							})
					.catch(error => {
						
					})
		          } else {
		            console.log('error submit!!');
		            return false;
		          }
		        });
		
		
		},
		partNameSearch(){
			axios.get('/api/part?PartNo='+this.partName +'&BrandID='+this.goodsForm.BrandID).then(result => {
					this.tablePartList = result.data.result;
				});
		
		},
		getBrandList(){
	      	axios.get('/api/brand').then(result => {
					this.BrandList = result.data.result;
				});
	      },
	     getSalesRepList(){
	      		axios.get('/api/getsalesRep').then(result => {
					this.SalesList = result.data.result;
				});
	      },
		getContactList(){
	        this.CompanyID =this.currentRow.CompanyID; 
	      	axios.get('/api/companycontact?CompanyID='+this.CompanyID).then(result => {
					this.ContactList = result.data.result;
				});
	      },
	     		
		EditRFQ(){
			if (this.currentRow.length<= 0) {
				this.$notify({ type: 'error', message: 'Please choose one line.' });
				return false;
			}
			
			this.CompanyID = this.currentRow.CompanyID;
			this.editform.CompanyID=this.currentRow.CompanyID;
			this.editform.CustomerID=this.currentRow.CustomerID;
			
			this.editform = this.currentRow;
			this.editform.ContactID = parseInt(this.currentRow.ContactID);
			this.editform.BrandID = parseInt(this.currentRow.BrandID);
			this.editform.SalesRepID = parseInt(this.currentRow.SalesRepID);
			this.editform.LeadFree = parseInt(this.currentRow.LeadFree);
			this.editform.Quantity = parseInt(this.currentRow.Quantity);
			if(this.currentRow.Hot ==1){
					this.editform.Hot =true;
			}
			if(this.currentRow.OpenPO ==1){
				this.editform.OpenPO =true;
			}
   			this.editdialogFormVisible = true;
			
			axios.get('/api/companycontact?CompanyID='+this.CompanyID).then(result => {
					this.ContactListEdit = result.data.result;
				});
		},
		Contact(CompanyID){
			axios.get('/api/companycontact?CompanyID='+CompanyID).then(result => {
					this.ContactList = result.data.result;
				});
		},
		
		EditRFQSave(formName){
			this.$refs[formName].validate((valid) => {
	          if (valid) {
	        	 axios.post('/api/customer/rfqedit',this.editform)
	          	.then(result => {
						if (result.data.code == 200) {
							this.editdialogFormVisible = false;
							this.getPurchOrderList();
						} else {
							this.$message.error({
								title: 'Error',
								message: result.data.message
							});
						}
					})
	          }else {
	            this.$message.error({
							title: 'Error',
							message: 'Please enter *'
						});
	            return false;
	          }
			});
		},
		
		searchPart(){
			if(this.goodsForm.BrandID == ''){
				return this.$message.error('Please choose Brand');
			}
			this.dialogTableVisible=true;
			this.tablePartList=[];
		},
		 openHome(row){
	        this.dialogTableVisible =false;
	        this.goodsForm.PartNo = row.PartNo;
	        this.goodsForm.PartID = row.PartID;
	        this.goodsForm.param = row;
	    },
	    
	    /* Call */
	    AddCall(){
		    if (this.currentRow.length<= 0) {
					this.$notify({ type: 'error', message: 'Please choose one line.' });
					return false;
				}
	  		this.tableHeight= 203;
	    	this.dialogtab=true;
	    	
	    	//tableDataTracking
	        axios.get('/api/trackingList?RFQID='+this.currentRow.RFQID).then(result => {
					this.tableDataTracking = result.data.result;
				}); 
	    	
	    	//Calls
	    	 axios.get('/api/callsList?RFQID='+this.currentRow.RFQID).then(result => {
					this.tableDataCalls = result.data.result;
				}); 
				
			//Quotation
			 axios.get('/api/quotationList?RFQID='+this.currentRow.RFQID+'&PartNo='+this.currentRow.PartNo).then(result => {
					this.QuotationList = result.data.result;
				}); 
				
	    	//OtherQuotation
	    	console.log(this.currentRow);
			 axios.get('/api/otherquotationList?PartNo='+this.currentRow.PartNo+'&PartNo='+this.currentRow.PartNo).then(result => {
					this.OtherQuotationList = result.data.result;
				}); 
	    	 
	    },
	    
	    //行选择
	    rowClick(row){
	    	this.tableHeight= 203;
	    	this.dialogtab=true;
	    	
	    	//tableDataTracking
	        axios.get('/api/trackingList?RFQID='+row.RFQID).then(result => {
					this.tableDataTracking = result.data.result;
				}); 
	    	
	    	//Calls
	    	this.getCalls(row.RFQID);
				
			//Quotation
			 axios.get('/api/quotationList?RFQID='+row.RFQID+'&PartNo='+row.PartNo).then(result => {
					this.QuotationList = result.data.result;
				}); 
				
	    	//OtherQuotation
			 axios.get('/api/otherquotationList?RFQID='+row.RFQID+'&PartNo='+row.PartNo).then(result => {
					this.OtherQuotationList = result.data.result;
				}); 
	    
	    
	    
	    },
	    
	    
	    getCalls(RFQID){
	    	 axios.get('/api/callsList?RFQID='+RFQID).then(result => {
					this.tableDataCalls = result.data.result;
				}); 
	    },
	    AddTracking(){
		    axios.get('/api/getBuyerRep').then(result => {
						this.BuyerRepList = result.data.result;
					});
			this.dialogAddTracking=true;
	    },
	    
	    AddTrackingSave(){
			axios.post('/api/addTrackingSave', {
					EmployeeIDs:this.BuyerRep,
					RFQID:this.currentRow.RFQID,
				  })
				  .then(res => {
					if(res.data.code ==200){
						this.$notify({
						  title: 'Success',
						  message: res.data.message,
						  type: 'success'
						});
						this.dialogAddTracking = false;
						this.AddCall();
					}
					
				  })
				  .catch(error => {
					  this.$notify.error({
						title: 'Error',
						message: 'ERROR',
					  });
				  })
	    },
	    DeleteTracking(){
	    	if (this.currentRowTracking.length<= 0 ) {
				//this.$notify({ type: 'error', message: 'Please choose one line.' });
				//return false;
				this.$alert('Please choose one line.', 'Tips', {
                  confirmButtonText: 'confirm'
		        });
		        return;
			}
	    	axios.post('/api/delTracking', {
					RFQTrackingID : this.currentRowTracking.RFQTrackingID,
				  })
				  .then(res => {
					if(res.data.code ==200){
						this.$notify({
						  title: 'Success',
						  message: res.data.message,
						  type: 'success'
						});
						this.AddCall();
					}
				  })
				  .catch(error => {
					  this.$notify.error({
						title: 'Error',
						message: 'ERROR',
					  });
				  })
	    
	    },
	    
	    TrackingCurrentChange(val){
	    	this.currentRowTracking = val;
	    },
	    
	    
	    /* CallsCurrentChange*/
	    CallsCurrentChange(val){
	    	this.currentRowCalls = val;
	    },
	    
	    /*New Vender */
	    VenderCallCurrentChange(val){
	    
	   	 	this.currentRowVenderCall = val; 
	    },
	    venderList(){
	    	 axios.get('/api/newVenderList?VendorID='+this.VendorID).then(result => {
						this.VenderList = result.data.result.data;
					});
	    },
	    //添加联系人
	    addContact(){
	    	this.AddContactVisible=true;
	    	
	    	
	    	
	    },
	    EditContact(){
	    
	    
	    },
	    contactsubmitForm(formName){
	    		var CompanyID =this.currentRow.CompanyID; 
		 
				 var reg=/^[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*@[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*\.[a-z]{2,}$/ ;
				 if(!reg.test(this.Contactform.Email)){
				 	 this.$message.error("Emial");
		         	 return;
				 }
				this.$refs[formName].validate((valid) => {
		          if (valid) {
		        	 axios.post('/api/customer/contactsadd',{
		        	 	CompanyID:CompanyID,
		        		ContactName:this.Contactform.ContactName,
		        		Gender:this.Contactform.Gender,
		          		Nickname:this.Contactform.Nickname,
		          		JobTitle:this.Contactform.JobTitle,
		          		Department:this.Contactform.Department,
		          		Phone1:this.Contactform.Phone1,
		          		Phone2:this.Contactform.Phone2,
		          		Fax:this.Contactform.Fax,
		          		Mobile1:this.Contactform.Mobile1,
		          		Mobile2:this.Contactform.Mobile2,
		          		Email:this.Contactform.Email,
		          		PersonalEmail:this.Contactform.PersonalEmail,
		          		IMAddress:this.Contactform.IMAddress,
		          		AddressLine:this.Contactform.AddressLine
		          	})
		          	.then(result => {
							if (result.data.code == 200) {
								this.AddContactVisible = false;
								//this.getContacts();
							} else {
								this.$message.error({
									title: 'Error',
									message: result.data.message
								});
							}
						})
		          }else {
		            this.$message.error({
								title: 'Error',
								message: 'Please enter *'
							});
		            return false;
		          }
				});
	    },
	    
	    //联系人-Vendor
	    searchVendorContact(){
				this.dialogTableVendorContact =true;
				this.tableVendorContactList=[];
				this.VendorName='';
				},
		openHomeVendorContact(row){
				this.dialogTableVendorContact =false;
				this.Contactform.VendorID = parseInt(row.VendorID);
				//this.Contactform.vendorparam = row;
				this.VendorID = parseInt(row.VendorID);
				this.venderList();
				
			},

		VendorNameQuotationContactSearch(){
				if(this.VendorName == '' || this.VendorName.length<=1){
					this.$alert('Text cannot be empty,more than 2 strings, please enter', 'Tips', {
						  confirmButtonText: 'confirm'
						});
						return;
				}
				axios.get('/api/vendorsearchlist?companyname='+this.VendorName).then(result => {
					this.tableVendorContactList = result.data.result.data;
				});
			
			},	
		
	    
	    SaveCall(formName){
	    	//console.log(this.form,this.currentRow,22222,this.currentRowCompanyContact);
	    	//this.currentRowCompanyContact
	    	if(this.currentRowCompanyContact.length<=0){
	    		this.$alert('Please choose one line.', 'Tips', {
                  confirmButtonText: 'confirm'
		        });
		        return;
	    	}
	    	
	    	this.$refs[formName].validate((valid) => {
		          if (valid) { 
		        	 axios.post('/api/addContactRecord',{vender:this.form,param:this.currentRow,contact:this.currentRowCompanyContact})
		          	.then(result => {
							if (result.data.code == 200) {
								//this.editContactdialogFormVisible = false;
								  this.$notify({
										  title: 'Success',
										  message: result.data.message,
										  type: 'success'
										});
										this.getCalls(this.currentRow.RFQID);
										
							} else {
								this.$message.error({
									title: 'Error',
									message: result.data.message
								});
							}
						})
		          }else {
		            this.$message.error({
								title: 'Error',
								message: 'Please enter *'
							});
		            return false;
		          }
				});
	    
	    },
	    changeVender(event){
	    	this.newVenderTable=true;
	    	this.vendorCompanyID='';
	    	this.contact(event);
	    	
	    },
	    
	    contact(event){
	    	axios.get('/api/companyContactList?vendorId=' +event).then(result => {
						this.companyContactList = result.data.result;
						this.vendorCompanyID=result.data.CompanyID;
					});
	    
	    },
	    companyContactCurrentChange(val){
	    		this.currentRowCompanyContact = val; 
	    },
	    
	    /* 询价列表 */
	    QuotationCurrentChange(val){
	    	this.currentRowQuotation = val; 
	    },
	    
	    OtherQuotationCurrentChange(val){
	    	this.currentRowOtherQuotation = val;  
	    },
	    /* ---询价--- */
	    addQuotation(){
	    	if (this.currentRow.length<= 0) {
				this.$notify({ type: 'error', message: 'Please choose one line.' });
				return false;
			}
			//console.log(this.currentRow);
	    	this.quotationformVisible=true;
	    	
	    	this.quotationform.BrandID = parseInt(this.currentRow.BrandID);
	    	this.quotationform.PartNo = this.currentRow.PartNo;
	    	this.quotationform.RFQID = parseInt(this.currentRow.RFQID);
	    	this.quotationform.PartID = parseInt(this.currentRow.PartID);
	    	this.partName = this.quotationform.PartNo;
	    },
	    
	    changeQuotationVendor(e){
	    	this.quotationform.ContactID ='';
	    	this.VendorID='';
		     axios.get('/api/companyContactList?vendorId=' +e).then(result => {
							this.companyContactQuotationList = result.data.result;
						});
			this.venderList();		
	    },
	    
	    AddQuotationSave(formName){
	    	this.$refs[formName].validate((valid) => {
		          if (valid) { 
		        	 axios.post('/api/addQuotation',{quotation:this.quotationform,param:this.currentRow})
		          	.then(result => {
							if (result.data.code == 200) {
								this.quotationformVisible = false;
								  this.$notify({
										  title: 'Success',
										  message: result.data.message,
										  type: 'success'
										});
									this.getPurchOrderList(); 	
							} else {
								this.$message.error({
									title: 'Error',
									message: result.data.message
								});
							}
						})
		          }else {
		            this.$message.error({
								title: 'Error',
								message: 'Please enter *'
							});
		            return false;
		          }
				});
	    	
	    	},
	    	partNameQuotationSearch(){
	    		if( this.quotationform.type ==1){
	    		  var BrandID =  this.quotationform.BrandID
	    		}else if(this.Salesquotationform.type ==2){
	    			var BrandID =this.Salesquotationform.BrandID;
	    		}
	    		console.log(this.quotationform.type,this.Salesquotationform.type);
	    		axios.get('/api/part?PartNo='+this.partName +'&BrandID='+BrandID).then(result => {
					this.tablePartQuotationList = result.data.result;
				});
	    	},
	    	searchPartQuotation(){
	    		if(this.quotationform.BrandID == ''){
					return this.$message.error('Please choose Brand');
				}
				this.dialogTableQuotationVisible=true;
	    		this.partName = this.quotationform.PartNo;
	    		this.tablePartQuotationList=[];
	    		this.quotationform.type =1;
	    		this.Salesquotationform.type=0;
	    	},
	    	 openHomeQuotation(row){
			        this.dialogTableQuotationVisible =false;
			        this.quotationform.PartNo = row.PartNo;
			        this.quotationform.PartID = row.PartID;
			        this.quotationform.Partparam = row;
			        
			        this.Salesquotationform.PartNo = row.PartNo;
			        this.Salesquotationform.PartID = row.PartID;
			    },
			    
		    //添加 Part--询价
		    AddPartQuotation(){
					this.dialogAddPart=true;
		    },
		    getPartType(){
				axios.get('/api/parttype').then(result => {
					this.PartTypeList = result.data.result;
				});
			
			},
			AddPartsubmitForm(formName){
				this.$refs[formName].validate((valid) => {
		          if (valid) {
		          	axios.post('/api/customer/partadd',{
		          		param:this.ruleForm,
		          	
		          	})
					.then(result => {
						if (result.data.code == 200) {
						this.$notify.success({
							title: 'Success',
							message: result.data.message
						});
						this.dialogAddPart=false;
						
							} else {
								this.$notify.error({
									title: 'Fail',
									message: result.data.message
								});
							}
								
							})
					.catch(error => {
						
					})
		          } else {
		            console.log('error submit!!');
		            return false;
		          }
		        });
			
			},
	    	
	    	searchVendor(){
	    		this.dialogTableVendor =true;
	    		//this.partName = this.quotationform.PartNo;
	    		this.tableVendorList=[];
	    		this.VendorName='';
	    		},
	    	
	    	openHomeVendor(row){
	    			this.dialogTableVendor =false;
			        this.quotationform.VendorID = parseInt(row.VendorID);
			        this.quotationform.vendorparam = row;
			        this.VendorID = parseInt(row.VendorID);
			        this.venderList();
			        
	    		},
	    			
	    	VendorNameQuotationSearch(){
	    			if(this.VendorName == '' || this.VendorName.length<=1){
	    				this.$alert('Text cannot be empty,more than 2 strings, please enter', 'Tips', {
			                  confirmButtonText: 'confirm'
					        });
					        return;
	    			}
	    			axios.get('/api/vendorsearchlist?companyname='+this.VendorName).then(result => {
						this.tableVendorList = result.data.result.data;
					});
	    			
	    			},		
	      getPaymentTerm(){
				axios.get('/api/customer/paymentterm').then(result => {
					this.PaymentList = result.data.result;
				});
		    },
		    
		  /* 添加 销售 询价 */
		    addSalesQuotation(){
		    	if (this.currentRow.length<= 0) {
					this.$notify({ type: 'error', message: 'Please choose one line.' });
					return false;
				}
	    		this.SalesquotationformVisible=true;
	    		
	    		this.Salesquotationform.Quantity = parseInt(this.currentRow.Quantity);
	    		this.Salesquotationform.BrandID = parseInt(this.currentRow.BrandID);
	    		this.Salesquotationform.PartNo = this.currentRow.PartNo;
	    		this.Salesquotationform.PartID = this.currentRow.PartID;
	    		this.Salesquotationform.CustomerPartNo = this.currentRow.CustomerPartNo;
	    		this.Salesquotationform.CompanyName = this.currentRow.CompanyName;
	    		
	    	},
	    	searchPartSalesQuotation(){
	    		if(this.Salesquotationform.BrandID == ''){
					return this.$message.error('Please choose Brand');
				}
				this.dialogTableQuotationVisible=true;
	    		this.partName = this.Salesquotationform.PartNo;
	    		this.tablePartQuotationList=[];
	    	 	this.Salesquotationform.type=2;
	    		this.quotationform.type=0;
	    	},
	    	
		    AddSalesQuotationSave(formName){
		   		this.$refs[formName].validate((valid) => {
		          if (valid) {
		          	axios.post('/api/sale/salesquotationadd',{
		          		salequotation:this.Salesquotationform,
		          		param:this.currentRow
		          	})
					.then(result => {
						if (result.data.code == 200) {
						this.$notify.success({
							title: 'Success',
							message: result.data.message
						});
							this.SalesquotationformVisible=false;
						
						} else {
							this.$notify.error({
								title: 'Fail',
								message: result.data.message
							});
						}
							
					})
					.catch(error => {
						
					})
		          } else {
		            console.log('error submit!!');
		            return false;
		          }
		        });
		   		
		   		
		   		
		   }, 
		    
		toDecimal(x) {
		      var f = parseFloat(x); 
		      if (isNaN(f)) { 
		        return false; 
		      } 
		      var f = Math.round(x*100)/100; 
		      var s = f.toString(); 
		      var rs = s.indexOf('.'); 
		      if (rs < 0) { 
		        rs = s.length; 
		        s += '.'; 
		      } 
		      while (s.length <= rs + 2) { 
		        s += '0'; 
		      } 
		      return s; 
		    },
	  getTime() {
			var date = new Date();
			let y = date.getFullYear();
			let m = date.getMonth() + 1;
			let d = date.getDate();
			let time = y + '-' + m + '-' + d;
			let d1 = '01';
			let time1 = y + '-' + m + '-' + d1;
			this.rantime[0] = time1;
			this.rantime[1] = time;
		},
		isTimeString(time){
		    	if(time=='' || time== null || time=='undefined'){
		    	 return '';
		    	}else{
		    		return time.substring(0,10);
		    	}
		    },
		    
		objTimeString(time){
	    	if(time=='' || time== null || time=='undefined'){
	    	 return '';
	    	}else{
	    		return time.date.substring(0,10);
	    	}
   		 },
		addTime(m) {
			return m < 10 ? '0' + m : m;
		},

		timeFormat(shijianchuo) {
			//shijianchuo是整数，否则要parseInt转换
			var time1 = new Date(shijianchuo);
			var y = time1.getFullYear();
			var m = time1.getMonth() + 1;
			var d = time1.getDate();
			var h = time1.getHours();
			var mm = time1.getMinutes();
			var s = time1.getSeconds();
			return y + '-' + this.addTime(m) + '-' + this.addTime(d) + ' ' + this.addTime(h) + ':' + this.addTime(mm) + ':' + this.addTime(s);
		}
	}
};
</script>

<style lang="scss">
.el-table--striped .el-table__body tr.el-table__row--striped.current-row td, .el-table__body tr.current-row>td {
    color: #fff;
    background-color: #a2a4a7!important;
}

.good_detail .canEdit .el-input__inner{
	 width: 160px!important;
}
 
</style>
